<template>
  <base-breadcrumb>
    <a-card>
      <a-steps
        :current="1"
        direction="vertical"
      >
        <a-step title="第一步">
          <span slot="description">
            <template>
              <div class="table-page-search-wrapper">
                <title-name title="基本信息" />
                <a-form-model
                  ref="basicForm"
                  :model="form"
                  :rules="basicRules"
                  hide-required-mark
                >
                  <a-row :gutter="24">
                    <a-col
                      :md="16"
                      :sm="16"
                    >
                      <a-form-model-item
                        label="所属单位"
                        :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
                        :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                        prop="projectId"
                      >
                        <org-tree-select
                          v-model="form.projectId"
                          is-auto-select-first
                          is-need-auth
                          check-strictly
                          appendToBody
                          :disabled="type == 'view'"
                          @select="selectOrg"
                        />
                      </a-form-model-item>
                    </a-col>
<!--                    <a-col-->
<!--                      :md="8"-->
<!--                      :sm="8"-->
<!--                    >-->
<!--                      <a-form-model-item-->
<!--                        label="所属分公司"-->
<!--                        :label-col="{ lg: { span: 6 }, sm: { span: 6 } }"-->
<!--                        :wrapper-col="{ lg: { span: 16 }, sm: { span: 16 } }"-->
<!--                        prop="branchComId"-->
<!--                      >-->
<!--                        <SelectSubCompany-->
<!--                          v-model="form.branchComId"-->
<!--                          placeholder="请选择"-->
<!--                          :disabled="type == 'view'"-->
<!--                        />-->
<!--                      </a-form-model-item>-->
<!--                    </a-col>-->
<!--                    <a-col-->
<!--                      :md="8"-->
<!--                      :sm="8"-->
<!--                    >-->
<!--                      <a-form-model-item-->
<!--                        label="所属项目"-->
<!--                        :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"-->
<!--                        :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"-->
<!--                        prop="projectId"-->
<!--                      >-->
<!--                        <SelectProject-->
<!--                          v-model="form.projectId"-->
<!--                          placeholder="请选择"-->
<!--                          :disabled="type == 'view'"-->
<!--                          key-value="branchComId"-->
<!--                          :form="form"-->
<!--                          :clear-list="true"-->
<!--                          @change="handleProChanged"-->
<!--                        />-->
<!--                      </a-form-model-item>-->
<!--                    </a-col>-->
                    <a-col
                      :md="8"
                      :sm="8"
                    >
                      <a-form-model-item
                        label="名称"
                        :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
                        :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
                        prop="subcontractingTechnicalReviewName"
                      >
                        <BaseInput
                          v-model="form.subcontractingTechnicalReviewName"
                          placeholder="请输入"
                          :disabled="type == 'view'"
                        />
                      </a-form-model-item>
                    </a-col>
                  </a-row>
                </a-form-model>
              </div>
            </template>
          </span>
        </a-step>
        <a-step title="第二步">
          <span
            v-if="id || resId"
            slot="description"
          >
            <a-card>
              <div class="table-operator">
                <title-name title="技术答辩情况" />
                <a-button
                  v-if="type !== 'view'"
                  type="primary"
                  @click="addPlan"
                >添加行</a-button>
              </div>
              <a-table
                row-key="id"
                :data-source="dataSource"
                :columns="columns"
                bordered
                :scroll="{ x: 1800 }"
              >
                <span
                  slot="description"
                  slot-scope="text"
                >
                  <ellipsis
                    :length="8"
                    tooltip
                  >{{ text }}</ellipsis>
                </span>
                <span
                  slot="serial"
                  slot-scope="text, record, index"
                >{{ index + 1 }}</span>

                <template
                  slot="qualified"
                  slot-scope="text, record"
                >
                  <span v-if="record.source == '0'">√</span>
                </template>
                <template
                  slot="new"
                  slot-scope="text, record"
                >
                  <span v-if="record.source == '1'">√</span>
                </template>
                <template
                  slot="source"
                  slot-scope="text, record"
                >
                  <span v-if="record.source == '0'">合格分包商名录</span>
                  <span v-if="record.source == '1'">新引进</span>
                </template>
                <template
                  slot="whetherSubmitDefenseMaterials"
                  slot-scope="text, record"
                >
                  <span>{{ record.whetherSubmitDefenseMaterials == 'false' ? '否' : '√是' }}</span>
                </template>
                <template
                  slot="whetherReplyPassed"
                  slot-scope="text, record"
                >
                  <span>{{ record.whetherReplyPassed == 'false' ? '不通过' : '√通过' }}</span>
                </template>
                <!-- 操作 -->
                <span
                  slot="operation"
                  slot-scope="text, record"
                >
                  <template v-if="type !== 'view'">
                    <a @click="editTable(record)">编辑</a>
                    <a-divider type="vertical" />
                    <a @click="deleteTable(record)">删除</a>
                  </template>
                </span>
              </a-table>
            </a-card>
          </span>
        </a-step>
      </a-steps>
    </a-card>
    <div class="page-btn-right-top" style="display: flex">
      <a-button
        v-if="(id || resId) && type !== 'view'"
        :loading="loading.isDraft"
        class="button ml12"
        type="danger"
        @click="discard(form)"
      >
        删除草稿
      </a-button>
      <a-button
        v-if="(id || resId) && type !== 'view'"
        :loading="loading.isDraft"
        class="button ml12"
        type="primary"
        @click="save"
      >
        保存草稿
      </a-button>
      <a-button
        v-if="(id || resId) && type !== 'view'"
        :loading="loading.isSubmit"
        class="button ml12"
        type="primary"
        @click="submit"
      >
        提交
      </a-button>
      <a-button
        v-else
        v-show="type !== 'view'"
        :loading="loading.isDraft"
        class="button"
        type="primary"
        @click="save"
      >
        下一步
      </a-button>
      <BasePrintButton
        v-if="type == 'view'"
        type="primary"
        :before-print-fn="getDetailsPrint"
      />
      <a-button
        class="ml12"
        type="primary"
        @click="handleClose"
      >
        关闭
      </a-button>
    </div>
    <!-- 弹框 -->
    <a-modal
      title="分包技术答辩情况"
      :visible="visible"
      :width="1010"
      @cancel="handleCancel"
      @ok="handleOk"
    >
      <a-form-model
        ref="form"
        :model="objFrom"
        :rules="rules"
        hide-required-mark
      >
        <a-row :gutter="24">
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="投标单位名称"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
              prop="bidders"
            >
              <BaseInput
                v-model.trim="objFrom.bidders"
                :max-length="50"
              />
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="来源"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
              prop="source"
            >
              <a-radio-group
                v-model="objFrom.source"
                class="radio-box"
              >
                <a-radio :value="0">
                  合格分包商名录
                </a-radio>
                <a-radio :value="1">
                  新引进
                </a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="答辩人"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
              prop="respondent"
            >
              <BaseInput
                v-model.trim="objFrom.respondent"
                :max-length="50"
              />
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="答辩人联系方式"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
              prop="respondentPhone"
            >
              <BaseInput
                v-model.trim="objFrom.respondentPhone"
                :max-length="11"
              />
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="是否提交资料"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
            >
              <a-radio-group
                v-model="objFrom.whetherSubmitDefenseMaterials"
                class="radio-box"
              >
                <a-radio :value="0">
                  是
                </a-radio>
                <a-radio :value="1">
                  否
                </a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="答辩通过情况"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
            >
              <a-radio-group
                v-model="objFrom.whetherReplyPassed"
                class="radio-box"
              >
                <a-radio :value="0">
                  通过
                </a-radio>
                <a-radio :value="1">
                  不通过
                </a-radio>
              </a-radio-group>
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="WBS关联"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
            >
              <!-- <BaseInput v-model="objFrom.associationWBS" /> -->
              <a-tree-select
                v-model="objFrom.associationWBS"
                style="width: 100%"
                :tree-data="wbsTreeData"
                :dropdown-style="{ maxHeight: '400px', overflow: 'auto' }"
                :replace-fields="treeReplace"
              />
            </a-form-model-item>
          </a-col>
          <a-col
            :md="12"
            :sm="12"
          >
            <a-form-model-item
              label="备注"
              :label-col="{ lg: { span: 5 }, sm: { span: 5 } }"
              :wrapper-col="{ lg: { span: 17 }, sm: { span: 17 } }"
            >
              <BaseTextarea
                v-model="objFrom.remarks"
                :max-length="500"
                :rows="4"
              />
            </a-form-model-item>
          </a-col>
        </a-row>
      </a-form-model>
    </a-modal>
  </base-breadcrumb>
</template>

<script>
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import TitleName from '@/components/TitleName/index.vue'
import {
    addList,
    editList,
    addDefense,
    editDefense,
    deleteDefense,
    getDetails,
    deleteList,
    getDetailsPrint,
} from '@/api/technical/review'
import { getWBS } from '@/api/safetySupervision/safteyClosureRecord'
import BasePrintButton from '@/components/BasePrintButton' // 打印按钮
const columns = [
    {
        title: '序号',
        dataIndex: 'serial',
        scopedSlots: { customRender: 'serial' },
    },
    {
        title: '投标单位名称',
        dataIndex: 'bidders',
    },
    {
        title: '合格分包商名录',
        dataIndex: 'qualified',
        scopedSlots: { customRender: 'qualified' },
    },
    {
        title: '新引进',
        dataIndex: 'new',
        scopedSlots: { customRender: 'new' },
    },
    {
        title: '来源',
        dataIndex: 'source',
        scopedSlots: { customRender: 'source' },
    },
    {
        title: '答辩人',
        dataIndex: 'respondent',
    },
    {
        title: '答辩人联系方式',
        dataIndex: 'respondentPhone',
    },
    {
        title: '是否提交答辩资料',
        dataIndex: 'whetherSubmitDefenseMaterials',
        scopedSlots: { customRender: 'whetherSubmitDefenseMaterials' },
    },
    {
        title: '答辩通过情况',
        dataIndex: 'whetherReplyPassed',
        scopedSlots: { customRender: 'whetherReplyPassed' },
    },
    {
        title: '备注',
        dataIndex: 'remarks',
    },
    {
        title: '关联WBS',
        dataIndex: 'associationWBS',
    },
    {
        title: '操作',
        dataIndex: 'operation',
        width: '120px',
        scopedSlots: { customRender: 'operation' },
    },
]
export default {
    name:'a'+Date.now(),    components: {
        TitleName,
        SelectSubCompany,
        SelectProject,
        BasePrintButton,
    },
    data() {
        this.columns = columns
        return {
            loading: {
                isDraft: false,
                isSubmit: false,
            },
            treeReplace: {
                title: 'label',
                value: 'id',
                key: 'id',
            },
            wbsTreeData: [], // wbs树
            transmitList: '',
            visible: false,
            reviewVisible: false,
            id: '',
            objFrom: {
                whetherReplyPassed: 1,
                whetherSubmitDefenseMaterials: 1,
            },
            type: '',
            disabled: false,
            dataSource: [],
            planId: '',
            form: {},
            basicRules: {
                branchComId: [{ required: true, message: '请选择', trigger: 'change' }],
                projectId: [{ required: true, message: '请选择', trigger: 'change' }],
                subcontractingTechnicalReviewName: [{ required: true, message: '请输入', trigger: 'change' }],
            },
            resId: '',
            cacheEdit: {},
            rules: {
                bidders: [{ required: true, message: '请输入', trigger: 'change' }],
                respondent: [{ required: true, message: '请输入', trigger: 'change' }],
                respondentPhone: [{ required: true, message: '请输入', trigger: 'change' }],
                source: [{ required: true, message: '请选择', trigger: 'change' }],
            },
        }
    },
    created() {
        this.id = this.$route.query.id
        this.type = this.$route.query.type
        this.getDetails()
    },
    methods: {
        selectOrg(val) {
          this.form.branchComId = val[val.length - 2].orgId
          this.getWbsTemplate()
        },
        getDetailsPrint() {
            return getDetailsPrint({ id: this.id }).then((res) => {
                console.log(res)
                return res.data.content
            })
        },
        discard(record) {
            console.log(this.id)
            let _this = this
            this.$confirm({
                title: '温馨提示',
                content: '确定是否删除数据？',
                okText: '确认',
                okType: 'danger',
                cancelText: '取消',
                onOk() {
                    return deleteList({ id: _this.id }).then((res) => {
                        if (res.data.code == '200') {
                            _this.$message.success('删除成功')
                            _this.handleClose() // 刷新
                        }
                    })
                },
                onCancel() {},
            })
        },
        handleProChanged() {
            this.getWbsTemplate()
        },
        // 获取WBS模板
        getWbsTemplate() {
            const { projectId } = this.form
            if (!projectId) return
            let params = {
                projectId,
            }
            getWBS(params).then((res) => {
                this.wbsTreeData = res.data.list
            })
        },
        handleClose() {
            this.$multiTab.close(this.$route.fullpath)
        },
        editTable(record) {
            this.objFrom = this.$clone(record)
            this.cacheEdit = record
            if (this.objFrom.whetherReplyPassed == 'true') {
                this.objFrom.whetherReplyPassed = 0
            } else {
                this.objFrom.whetherReplyPassed = 1
            }
            if (this.objFrom.whetherSubmitDefenseMaterials == 'true') {
                this.objFrom.whetherSubmitDefenseMaterials = 0
            } else {
                this.objFrom.whetherSubmitDefenseMaterials = 1
            }

            this.visible = true
            this.planId = record.id
            console.log(this.objFrom)
        },
        deleteTable(record) {
            let _this = this
            this.$confirm({
                title: '温馨提示',
                content: '确定是否删除数据？',
                okText: '确认',
                okType: 'danger',
                cancelText: '取消',
                onOk() {
                    deleteDefense({ id: record.id }).then((res) => {
                        if (res.code === 200 || res.data.code === 200) {
                            _this.$message.success('删除成功')
                            _this.getDetails()
                        }
                    })
                },
                onCancel() {},
            })
        },
        save() {
            this.$refs.basicForm.validate((valid) => {
                if (!valid) return
                if (this.loading.isDraft) return
                this.loading.isDraft = true
                this.form.auditStatus = '0'
                if (this.id) {
                    //编辑
                    editList({ ...this.form, id: this.id })
                        .then((res) => {
                            this.loading.isDraft = false
                            if (res) {
                                // if (this.resId) {
                                this.$message.success('成功')
                                this.handleClose()
                                // } else {
                                //     this.reviewVisible = true
                                //     this.$message.success('成功')
                                //     this.resId = res.data.id
                                //     console.log(this.resId)
                                // }
                            }
                            if (res.id) {
                                this.resId = res.data.id
                            }
                        })
                        .catch(() => {
                            this.loading.isDraft = false
                        })
                } else {
                    //新增
                    addList(this.form)
                        .then((res) => {
                            this.loading.isDraft = false
                            if (res.code === 200) {
                                this.reviewVisible = true
                                if (this.resId) {
                                    this.$message.success('成功')
                                    this.handleClose()
                                } else {
                                    this.$message.success('成功')
                                    this.resId = res.data.id
                                    this.id = res.data.id
                                    console.log(this.resId)
                                }
                            }
                            if (res.id) {
                                this.resId = res.data.id
                            }
                        })
                        .catch(() => {
                            this.loading.isDraft = false
                        })
                }
            })
        },
        submit() {
            this.$refs.basicForm.validate((valid) => {
                if (!valid) return
                if (this.loading.isSubmit) return
                this.loading.isSubmit = true
                this.form.auditStatus = '1'
                if (this.id) {
                    //编辑
                    editList({ ...this.form, id: this.id })
                        .then((res) => {
                            this.loading.isSubmit = false
                            if (res.code === 200) {
                                this.reviewVisible = true
                                this.$message.success('成功')
                                this.handleClose()
                            }
                            if (res.id) {
                                this.id = res.id
                            }
                        })
                        .catch(() => {
                            this.loading.isSubmit = false
                        })
                } else {
                    //新增
                    addList(this.form)
                        .then((res) => {
                            this.loading.isSubmit = false
                            if (res) {
                                this.reviewVisible = true
                                this.$message.success('成功')
                                this.handleClose()
                            }
                            if (res.id) {
                                this.id = res.id
                            }
                        })
                        .catch(() => {
                            this.loading.isSubmit = false
                        })
                }
            })
        },
        getDetails() {
            //查询详情
            if (this.id) {
                getDetails({ id: this.id }).then((res) => {
                    this.form = res.data.basic ? { ...res.data.basic } : {}
                    this.dataSource = res.data.defense
                    this.$nextTick(() => {
                        this.form.projectId = (res.data.basic && res.data.basic.projectId) || ''
                    })
                })
            }
        },
        addPlan() {
            this.objFrom = { ...this.$options.data().objFrom }
            this.planId = ''
            this.visible = true
        },
        handleOk() {
            this.cacheEdit = {}
            this.$refs.form.validate((valid) => {
                if (valid) {
                    if (this.objFrom.whetherReplyPassed == '0') {
                        this.objFrom.whetherReplyPassed = 'true'
                    } else {
                        this.objFrom.whetherReplyPassed = 'false'
                    }
                    if (this.objFrom.whetherSubmitDefenseMaterials == '0') {
                        this.objFrom.whetherSubmitDefenseMaterials = 'true'
                    } else {
                        this.objFrom.whetherSubmitDefenseMaterials = 'false'
                    }
                    this.visible = false
                    if (this.planId) {
                        //判断是新增还是编辑技术答辩
                        // value.push({id:this.planId})a
                        let tableId = this.planId
                        let id
                        if (this.id) {
                            //判断是新增还是编辑基本信息
                            id = this.id
                        } else {
                            id = this.resId
                        }
                        let data = { ...this.objFrom, tableId, id }
                        console.log(data)
                        editDefense(data).then((res) => {
                            if (res.data.code === 200 || res.code === 200) {
                                this.$message.success('修改成功')
                                getDetails({ id: this.id }).then((res) => {
                                    this.dataSource = res.data.defense
                                    console.log(res)
                                })
                            }
                        })
                    } else {
                        if (this.id) {
                            //判断是新增还是编辑
                            this.objFrom.id = this.id
                        } else {
                            this.objFrom.id = this.resId
                        }
                        addDefense(this.objFrom).then((res) => {
                            if (res.data.code === 200 || res.code === 200) {
                                this.$message.success('新增成功')
                                getDetails({ id: this.resId || this.id }).then((res) => {
                                    this.dataSource = res.data.defense
                                    console.log(res)
                                })
                            }
                        })
                    }
                }
            })
        },
        handleCancel() {
            this.objFrom = this.cacheEdit
            this.visible = false
            // this.$refs.form.resetFields()
        },
        addTable() {
            this.visible = true
        },
    },
}
</script>

<style>
</style>
